<template>
  <input
    v-show="false"
    ref="input"
    :accept="accept.join(',')"
    type="file"
    @change="handleInputChange"
  />
</template>
<script>
import { postUploadFile } from '@/api/forecast';
export default {
  props: {
    accept: {
      type: Array,
      default: () => ['application/vnd.ms-excel', '.xlsx'],
    },
    visible: {
      type: [Boolean],
      default: false,
    },
    planId: {
      type: Number,
      default: 0,
    },
    type: {
      type: Number,
      default: 1,
    },
  },
  data() {
    return {};
  },
  computed: {},
  methods: {
    uploader() {
      this.$refs.input?.click && this.$refs.input?.click();
    },
    async handleInputChange(e) {
      const file = e.target.files[0];
      this.$store.commit('setSpinning', true);
      const result = await postUploadFile(file, this.planId, this.type).finally(
        () => {
          this.$store.commit('setSpinning', false);
          e.target.value = null;
        }
      );

      this.$emit('change', result?.data?.data || []);
    },
    handleCancel() {
      this.$emit('update:visible', false);
    },
  },
};
</script>

<style lang="less" scoped>
.co {
  color: red;
}
</style>
